<template>
    <div>
        <div class="container">
    <div class="col-md-4"></div>
    <div class="col-md-4" style="background-color:#eee;;margin-top:200px;">
        <center>
            <h3>凯里学院学生信息管理系统</h3>
        </center>
        <form action="">
            <div class="form-group">
                <label for="">用户名:</label>
                <input type="text" v-model="account" class="form-control" style="color:red;">
            </div>
              <div>{{account}}</div>
            <div class="form-group">
                <label for="">密码</label>
                <input type="password" v-model="password" class="form-control" style="color:red;">
            </div>
               <div>{{password}}</div>
            <div class="form-group">
                <input type="submit" value="登陆" @click="login" class="btn btn-success form-control">
            </div>
        </form>
    </div>
    <div class="col-md-4"></div>
</div>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    name:'login',
    data(){
        return{
            account:'',
            password:''
        }
    },
    methods:{
        login(){
            let that=this;
            console.log(this.account);
            axios({
                url: `http://localhost:81/Users/${this.account}`,
                method: "Get",
            })
            .then(res=> {
                console.log(res);
                if(res.data.length!=0){
                    //将登录成功后的信息保存到用户sessionStorage中
                    window.sessionStorage.setItem('token',res.data[0])
                    res.data[0].userRole
                    console.log(res.data[0].userRole);
                    console.log(res.data[0].username);
                    console.log(res.data[0].account);
                    console.log(res.data[0].password);
                    // alert('登陆成功');
                    //跳转到主页,并且将用户角色传递到主页
                    that.$router.push({name:'subject',
                    params:{
                        userRole:res.data[0].userRole,
                        username:res.data[0].username,
                        account:res.data[0].account,
                        password:res.data[0].password

                        }}
                    );
                }else{
                    alert('用户名或密码错误');
                }
            })
            .catch(error=> {
                console.log(error);
            });
        }
    }
}
</script>

<style>

</style>